import type { ProFormInstance } from '@ant-design/pro-components';
import {
  DrawerForm,

  ProFormText,
} from '@ant-design/pro-components';
import React, { useRef, useState } from 'react';
import type { FormRowData } from '../data';
export type FormValueType = {
  target?: string;
  template?: string;
  type?: string;
  time?: string;
  frequency?: string;
} & Partial<FormRowData>;

export type CreateUserProps = {
  onCancel: (flag?: boolean, formVals?: FormValueType) => void;
  onSubmit: (values: FormValueType) => Promise<void>;
  updateModalVisible: boolean;
  values: Partial<FormRowData>;
  formType: number;
};
// eslint-disable-next-line react-hooks/rules-of-hooks
const CreateUserDrawer: React.FC<CreateUserProps> = (props) => {
  const formRef = useRef<ProFormInstance>();
  return (
    <DrawerForm
      title="新建渠道"
      width="620px"
      formRef={formRef}
      visible={props.updateModalVisible}
      onVisibleChange={(val) => {
        if (!val) {
          props.onCancel();
        }
        formRef?.current?.setFieldsValue({
          type: 'super',
        });
      }}
      onFinish={async (val) => {
        props.onSubmit({ ...val });
      }}
    >
      <ProFormText
        width="md"
        name="name"
        label="渠道简称"
        tooltip="最长为 24 位"
        placeholder="请输入渠道简称"
        rules={[{ required: true, message: '渠道简称不能为空!' }]}
      />
      <ProFormText
        width="md"
        name="company"
        label="公司名称"
        placeholder="请输入公司名称"
        rules={[{ required: true, message: '公司名称不能为空!' }]}
      />
     
    </DrawerForm>
  );
};

export default CreateUserDrawer;
